<template>
  <div>
    <el-menu :default-active="activeIndex"
             class="el-menu-demo"
             mode="horizontal"
             @select="handleSelect">
      <el-menu-item index="1">笔记标签</el-menu-item>
      <el-divider direction="vertical"></el-divider>
      <el-menu-item index="2">读书笔记</el-menu-item>
      <el-menu-item index="3">人工智能</el-menu-item>
      <el-menu-item index="4">教师专业发展</el-menu-item>
      <el-menu-item index="5">课程重点</el-menu-item>
      <el-menu-item index="6">干货</el-menu-item>
      <el-menu-item index="7">值得收藏</el-menu-item>
      <el-submenu index="8">
        <template slot="title">用户自定义标签等</template>
        <el-menu-item index="2-8-1">选项1</el-menu-item>
        <el-menu-item index="2-8-2">选项2</el-menu-item>
        <el-menu-item index="2-8-3">选项3</el-menu-item>
      </el-submenu>
    </el-menu>
  </div>
</template>
  
  <script>
export default {
  data() {
    return {
      activeIndex: '1',
    }
  },
  methods: {
    handleSelect() {
      return {}
    },
  },
}
</script>
  <style scoped>
</style>
  